import React, { Component } from 'react'
import AdminLayout from '@components/AdminLayout'
import { adminRoutes } from '@routes'
import { Switch,Route,Redirect } from 'react-router-dom'
// 处理侧边栏

export default class Admin extends Component {
  render() {
   
    return (
      <div>
        <AdminLayout>
          <Switch>
            {
              adminRoutes.map((route)=>{
                return (
                  <Route 
                    key={route.path}
                    path={route.path}
                    render = {(routerProps)=>{
											// 取 token
											const token = localStorage.getItem("accessToken")
											return (
												// 判断是否登录
												token
												?
												(function(){
													// 判断用户身份
													// 拿到当前 路由的可访问 roles
													let roles = route.meta.roles;
													// 拿到 当前 用户的 role
													const userInfo = localStorage.getItem('userInfo')?JSON.parse(localStorage.getItem('userInfo')):{};
													// 判断 当前用户 能否访问
													let hasPerssion = roles.some(role=>role === userInfo.role )
													if(hasPerssion){
														return <route.component {...routerProps}/>
													}else{
														return <Redirect to="/admin/noPerssion"/>
													}
												}())
												:
												<Redirect to={ {
													pathname:'/login',
													state:{
														from:route.path
													}
												} }/>
											)
										}}
                  />
                )
              })
            }
            <Redirect to="/admin/dashBoard" from="/admin" exact/>
            <Redirect to="/admin/404"/>
          </Switch>
        </AdminLayout>
      </div>
    )
  }
}
